import { defineComponent } from 'vue'
import type { RouteRecordRaw } from 'vue-router'

type Component<T extends any = any> = ReturnType<typeof defineComponent> | (() => Promise<typeof import('*.vue')>) | (() => Promise<T>)

interface RouteMeta {
  icon?: string
  isLink?: string
  isAffix?: boolean
  isHide?: boolean
  isKeepAlive?: boolean
  title: string
  index?: string | number
  roles?: string[]
}

// @ts-ignore
export interface AppRouteRecordRaw extends Omit<RouteRecordRaw, 'meta'> {
  name: string
  meta: RouteMeta
  component?: Component | string
  components?: Component
  children?: AppRouteRecordRaw[]
  props?: Recordable
  fullPath?: string
  query?: Partial<Recordable> | undefined
}

export interface Menu {
  name: string
  path: string
  No?: number
  query?: Partial<Recordable> | undefined
  meta: Partial<RouteMeta>
  children?: Menu[]
  icon?: string
}

/** 布局 state配置 */
export interface ThemeConfigState {
  globalTitle: string;
  isShowLogo: boolean;
  animation: string;
  layout: string;
  isShowLogoChange: boolean;
  menuBarBgColor: string;
  sideBarBgColor: string;
  logoBgColor: string;
  isCacheTagsView: boolean;
  isUniqueOpened: boolean;
  isTagsviewIcon: false;
  isCollapse: boolean;
}

/** app state配置 */
export interface AppState {
  requestCount: any
  token: string
  refreshToken: string
  userInfo: object | null
  menuList: Array<AppRouteRecordRaw>
}

export interface RoutesListState {
  routesList: Array<AppRouteRecordRaw>
}

export interface TagsViewRoutesState {
  tagsViewRoutes: Array<Menu>
}

// 主接口(顶级类型声明)
export interface RootStateTypes {
  themeConfig: ThemeConfigState
  app: AppState
  routesList: RoutesListState
  tagsViewRoutes: TagsViewRoutesState
}

export type AppRouteModule = AppRouteRecordRaw

export interface RootGettersTypes {
  [key: string]: (state: RootStateTypes) => any
}
